<!DOCTYPE html>
<html>
	<head>
		<!-- <meta> -->
		<meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<title></title>
		<style type="text/css">
			*{
				margin: 0px;
				padding: 0px;
				
			}
			a{
				text-decoration: none;
			}
			li{
				list-style: none;
			}
			.fj{
				width: 100%;
				max-width: 640px;
				min-width: 320px;
				position: relative;
				margin: auto;
			}
			.nav{
				height: 1.2rem;
				width: 100%;
				background-image: url(icon/nav.png);
				background-position: center !important;
				background-size: 100% 100% !important;
				top: 0;
				left: 0;
				position: fixed;
				z-index: 9999;
				display: flex;
				align-items: center;
				text-align: center;
			}
			.nav a{
				display: block;
				width: 0.4rem;
				height: 0.6rem;
				background-repeat: no-repeat !important;
				background-position: center;
				position: absolute;
				left: 0.3rem;
			}
			.nav a img{
				width: 0.4rem;
				height: 0.6rem;
			}
			.nav p{
				width: 100%;
				height: 100%;
				text-align: center;
				color: whitesmoke;
				font-size: 0.42rem;
				line-height: 1.2rem;
			}
			
			form{
				width: 100%;
				height: 10.6rem;
				display: flex;
				flex-wrap: wrap;
				position: absolute;
				align-content:space-between;
				justify-content: center;
				top: 1.2rem;
			}
			form p{
				display: inline;
			}
			form>div{
				width: 9rem;
				height: 1.2rem;
				box-sizing: border-box;
				font-size: 0.28rem;
			}
			form>div:nth-of-type(1){
				margin-top: 0.2rem;
			}
			form>div:nth-of-type(7){
				display: flex;
				justify-content:space-between; 
				align-items: center;
				border: 0px!important;
			}
			form>div:nth-of-type(7) div:nth-of-type(1){
				display: inline-block;
				width: 0.27rem;
				height: 0.27rem;
				background: red;
			}
			form>div:nth-of-type(7) div:nth-of-type(2){
				display: inline-block;
				width: auto;
				color: darkgrey;
				height: 0.27rem;
				
			}
			 form input{
				width: 5.3rem;
				margin-left: 0.6rem;
				height: 1.2rem;
				border: none;
				box-sizing: border-box;
				font-size: 0.28rem;
			} 
			.zhuce{
				height: 2rem;
				width: 100%;
				display: flex;
				justify-content: center;
				align-items: center;
				 position: absolute;
				 top: 11.9rem;
			}
			.zhuce div{
				width:4.2rem ;
				height: 1.06rem;
				border-radius: 5px;
				background-color: rgb(242,58,56);
				text-align: center;
				line-height: 1.06rem;
				color: whitesmoke;
			}
		</style>
	</head>
	<body>
		<div class="fj">
			<div class="nav">
				<a href="javascript:history.go(-1)"><img src="icon/fanhui@2x.png" ></a>
				<p>注册</p>
			</div>
			<form action="">
				<div>用户名<input type="number" name="zhanghao" placeholder="请输入账号"></div>
				<div>手机号<input type="number" name="" id="" value="" placeholder="请输入手机号"/></div>
				<div>验证码<input type="text" name="" id="" value="" placeholder="输入验证码"/><p>获取验证码</p></div>
				<div>登录密码<input type="password" name="" id="" value=""  placeholder="请输入密码"/></div>
				<div>确认密码<input type="password" name="" id="" value=""  placeholder="请输入密码"/></div>
				<div>邀请码<input type="text" name="mima" placeholder="可以不填"></div>
				<div>
					<div></div>
					<div>我已阅读并同意《云安装协议》</div>
				</div>
			</form>
			<div class="zhuce">
				<div class="an"><a href="首页.html">立即注册</a></div>
			</div>
		</div>
	</body>
	<script type="text/javascript" src="icon/flexible.js">
		
	</script>
</html>
